<template>
  <div>
    child2组件 - {{ count }} - <button @click="handleClick">btn</button> -
    <button @click="handleClick2">btn</button> -
    <button @click="handleClick3">btn</button>
  </div>
</template>

<script>
// mapMutations用于简化mutations的写法的
import { mapMutations } from "vuex";

export default {
  computed: {
    count() {
      return this.$store.state.count;
    },
  },
  methods: {
    // 将仓库的mutations的函数映射到组件的props中
    // 现在的组件的props里面有add和minus两个函数了
    // ...mapMutations(["add", "minus"]),
    ...mapMutations({
      add2: "add",
      minus: "minus",
    }),
    handleClick() {
      this.add2({ num: 2 });
    },
    handleClick2() {
      this.add2({ num: 3 });
    },
    handleClick3() {
      this.minus({ num: 5 });
    },

    // handleClick() {
    //   this.$store.commit("add", {
    //     num: 2,
    //   });
    // },
    // handleClick2() {
    //   // this.$store.commit("add", {
    //   //   num: 3,
    //   // });
    //   // 等同于
    //   this.$store.commit({
    //     type: "add",
    //     num: 3,
    //   });
    // },
    // handleClick3() {
    //   this.$store.commit("minus", {
    //     num: 5,
    //   });
    // },
  },
};
</script>
